<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <link rel="stylesheet" type="text/css" href="./css/aui-slide.css" />
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/api.js"></script>
</head>

<body>
    <header class="aui-bar aui-bar-nav">
        <a class="aui-pull-left" onclick="closeWin()">
            <span class="aui-iconfont aui-icon-left"></span>
        </a>
        <div class="aui-title">交易消息</div>
    </header>
    <div class="aui-bar-nav-d"></div>

    <style>
        body {
            background: #fff;
        }
    </style>


    <!-- <ul class="message-trading">

        <h3><span>2018年5月28日 15:58</span></h3>
        <li class="gray">
            <dl>
                <dt>扣款通知</dt>
                <dd>您选择【金可贷】平台的一款债权出借成功，账户扣款人民币20000 .00元，当前账户可用余额人民币35000.00元
                </dd>
            </dl>
            <p>交易时间：2018年5月28日</p>
            <p>交易类型：债权出借扣款（智投3号）</p>
            <p>交易金额：人民币20000.00元</p>
        </li>

        <h3><span>2018年5月28日 15:58</span></h3>
        <li class="blue">
            <dl>
                <dt>到期通知</dt>
                <dd>您的账户于2018年6月6日有一笔债权到期，出借金额为人民币10000 .00元，预计结清日期为6月6日，当天到账（如遇特殊情况，以实际 到账日期为准）
                </dd>
            </dl>
            <p>备注：出借债权到期提醒（智投2号）</p>
        </li>

        <h3><span>2018年5月28日 15:58</span></h3>
        <li class="orange">
            <dl>
                <dt>到账通知</dt>
                <dd>您的【金可贷】账户一笔债权到期，本金入账人民币10000.00元，当 前账户可用余额人民币15000.00元
                </dd>
            </dl>
            <p>交易时间：2018年6月6日</p>
            <p>交易类型：到期还本（智投3号）</p>
            <p>交易金额：人民币10000.00元</p>
        </li>

        <h3><span>2018年5月28日 15:58</span></h3>
        <li class="green">
            <dl>
                <dt>充值通知</dt>
                <dd>您的【金可贷】账户成功充值人民币10000.00元，当前账户可用余额 人民币15600.86元
                </dd>
            </dl>
            <p>交易时间：2018年6月6日</p>
            <p>交易类型：账户充值</p>
            <p>交易金额：人民币10000.00元</p>
        </li>
    </ul> -->


    <div id="list">
    </div>
    <script type='text/template' id='template'>
        <ul class="message-trading">
            {{~it :value:index}}
            <h3><span>{{=value.message_date}}</span></h3>
            {{? value.template_id == 1}}
            <li class="red">
            {{?? value.template_id == 2}}
            <li class="blue">
            {{?? value.template_id == 3}}
            <li class="orange">
            {{?? value.template_id == 4}}
            <li class="green">
            {{?? value.template_id == 5}}
            <li class="yellow">
            {{?? value.template_id == 6}}
            <li class="purple">
            {{?? value.template_id == 7}}
            <li class="purblue">
              {{??}}
              <li class="gray">
            {{?}}

                {{=value.message_content}}
            </li>
            {{~}}
        </ul>
    </script>



</body>
<script type="text/javascript">
var page = 0;
    apiready = function() {
        load_list();
        down_refresh();
    }



    function load_list(n) {
        var userid = $api.getStorage('userid');
        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: '努力加载中...',
            text: '先喝杯茶...',
            modal: false
        });
        if (n) {
            page += 1;
        } else {
            page = 0;
        }

        api.ajax({
            url: webAddress + '/index.php?ctl=SyntheticMessage&act=get_message',
            method: 'post',
            data: {
                values: {
                    page: page,
                    uid: userid,
                    message_type: '1'
                },
            }
        }, function(ret, err) {
            if (ret) {
                api.hideProgress();
                reloadDataN(ret);


            } else {
                alert(JSON.stringify(err));
            }
        });
    }


    function reloadDataN(ret) {
        var template = $api.byId('template');
        var dotFn = doT.template(template.innerHTML);
        var html = dotFn(ret);
        var list = $api.byId('list');
        if (page == 0) {
            $api.html(list, html);
        } else {
            if (!ret) {
                api.toast({
                    msg: '没有更多了',
                    duration: 2000,
                    location: 'bottom'
                });
                return;
            }
            $api.append(list, html);
        }
    }

    function down_refresh() {
        api.addEventListener({
            name: 'scrolltobottom',
            extra: {
                threshold: 50 //设置距离底部多少距离时触发，默认值为0，数字类型
            }
        }, function(ret, err) {
            load_list(true);
        });
    }





    function closeWin() {
    api.openWin({
        name: 'message',
        url: './message.html',
        reload:true,


    });


      // api.closeWin({
      //     name: 'message_trading'
      // });
    }
</script>

</html>
